// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.beatmapset-versions {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 0;
  font-size: @font-size--normal;

  &__change {
    display: flex;
    align-items: center;
    gap: 0 16px;
  }

  &__changes {
    list-style: none;
    font-size: @font-size--title-small;
    display: grid;
    gap: 4px;
    grid-column: 1 / -1;
    padding: 0;
  }

  &__entry {
    padding: 8px;
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
    gap: 10px 8px;
    align-items: baseline;
    background: hsl(var(--hsl-b4));
    border-radius: @border-radius--large;
  }

  &__icon {
    font-size: 16px; // icon size
    display: flex;

    &--removed {
      color: hsl(var(--hsl-red-1));
    }

    &--updated {
      color: hsl(var(--hsl-blue-1));
    }

    &--added {
      color: hsl(var(--hsl-green-1));
    }
  }

  &__number {
    .link-white();
    .link-plain();
    background: hsl(var(--hsl-b2));
    border-radius: @border-radius-base;
    padding: 4px 8px;
    text-align: center;
    text-transform: uppercase;
    line-height: 1;

    .link-hover({
      background: hsl(var(--hsl-b1));
    });
  }
}
